<template>
    <div>
        <breadcrumb :routerList="routerList"></breadcrumb>  
        <el-button type="primary" icon="el-icon-plus" @click="newClassClick">新增分类</el-button>
        <classTable :classList="classList" @refreshTableFun="refreshTableFun"></classTable>
    </div>
</template>

<script>
import breadcrumb from '@/components/breadcrumb.vue'
import classTable from '@/components/classTable.vue'

export default {
    components: {breadcrumb,classTable},
    data(){
        return {
            routerList: [
                {
                    name: '商品管理',
                    path: ''
                },
                {
                    name: '分类列表',
                    path: ''
                },
            ],
            classList: [],
        }
    },
    created(){
        this.getClass()
    },
    methods:{
        async getClass(){
            let res = await this.$Http.getOneClassList()
            if(res.length!=0){
                for(let i in res){
                    let two = await this.$Http.getTwoClassList({two_class_id: res[i].id})
                    if(two.length!=0){
                        res[i].children = two
                    }
                }
                this.classList = res
                console.log(this.classList)
            }
        },
        newClassClick(){
            this.$router.push({
                path: '/newClass',
                query: {type: 1,list: ''}
            })
        },
        refreshTableFun(){
            this.getClass()
        }
    }
}
</script>

<style>
    .el-button{
        margin: 20px 0;
    }
</style>
